<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head th:include="include :: header"></head>
<script src="/js/jquery.min.js?v=2.1.4"></script>
<body class="gray-bg">
	<div class="wrapper wrapper-content ">
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
					<div class="ibox-content">
						<form class="form-horizontal m-t" id="signupForm">

							<div class="form-group">
								<label class="col-sm-3 control-label">头像：</label>
								<div class="col-sm-8">
									<input type="hidden" id="picId" name="picId" value="0" >
									<img id="showImg" src="/img/backg01.jpg" style="width: 20%;cursor: pointer;" >
									<input  type="file" class="hidden" id="file" name="file" onchange="uploadFile(this.files)" />
								</div>
								<script type="text/javascript">
                                    $("#showImg").click(function () {
                                        $("#file").click();
                                    });

                                    function uploadFile(files) {

                                        var type = files[0].type;
                                        if(type.indexOf("image") < 0){
                                            layer.msg('请上传图片格式...', {
                                                icon: 2
                                            });
                                            return false;
                                        }
                                        var size = files[0].size;
                                        if ((size / 1024 / 1024) > 2) {
                                            layer.msg('图片大小不能超过2M...', {
                                                icon: 2
                                            });
                                            return false;
                                        }
                                        console.log("size=" + size);
                                        var formData = new FormData();
                                        formData.append("file", files[0]);
                                        $.ajax({
                                            data: formData,
                                            type: "POST",
                                            url: "/common/sysFile/upload",    // 图片上传出来的url，返回的是图片上传后的路径，http格式
                                            cache: false,
                                            contentType: false,
                                            processData: false,
                                            dataType: "json",
                                            success: function (data) {//data是返回的hash,key之类的值，key是定义的文件名
                                                $("#showImg").attr("src", data.fileName);
                                                $("#picId").val(data.sysFileId);
                                            },
                                            error: function () {
                                                layer.msg('上传失败', {
                                                    icon: 2
                                                });
                                            }
                                        });
                                    }
								</script>
							</div>

							<div class="form-group">	
								<label class="col-sm-3 control-label">姓名：</label>
								<div class="col-sm-8">
									<input id="username" name="username" class="form-control"
										   placeholder="请输入长度不大于30的字符" maxlength="30" onkeyup="this.value=this.value.replace(/\s+/g,'')" type="text">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">手机号：</label>
								<div class="col-sm-8">
									<input id="mobile" name="mobile" placeholder="请输入长度为11的字符" maxlength="11" class="form-control" type="text">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">性别：</label>
								<div class="col-sm-8">
									<label class="radio-inline">
										<input type="radio" name="sex" value="1" checked /> 男
									</label>
									<label class="radio-inline">
										<input type="radio" name="sex" value="0" /> 女
									</label>
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">出生日期：</label>
								<div class="col-sm-8">
									<input id="birth" name="birth" placeholder="请选择出生日期" readonly class="layer-date form-control" type="text">
								</div>
							</div>
														<!--<div class="form-group">	-->
								<!--<label class="col-sm-3 control-label">密码：</label>-->
								<!--<div class="col-sm-8">-->
									<!--<input id="password" name="password" class="form-control" type="text">-->
								<!--</div>-->
							<!--</div>-->

							<div class="form-group">
								<label class="col-sm-3 control-label">身份证号：</label>
								<div class="col-sm-8">
									<input id="idCard" name="idCard" placeholder="请输入长度不大于18的字符" maxlength="18" class="form-control" type="text">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">民族：</label>
								<div class="col-sm-8">

									<select data-placeholder="--选择民族--" name="nation" id="nation" class="form-control chosen-select" tabindex="2">
										<option value="">-- 选择民族 --</option>
										<option value="汉族">汉族</option>
										<option value="满族"  th:selected="${user.nation == '满族'}">满族</option>
										<option value="蒙古族">蒙古族</option>
										<option value="回族">回族</option>
										<option value="藏族">藏族</option>
										<option value="维吾尔族">维吾尔族</option>
										<option value="苗族">苗族</option>
										<option value="彝族">彝族</option>
										<option value="壮族">壮族</option>
										<option value="布依族">布依族</option>
										<option value="侗族">侗族</option>
										<option value="瑶族">瑶族</option>
										<option value="白族">白族</option>
										<option value="土家族">土家族</option>
										<option value="哈尼族">哈尼族</option>
										<option value="哈萨克族">哈萨克族</option>
										<option value="傣族">傣族</option>
										<option value="黎族">黎族</option>
										<option value="傈僳族">傈僳族</option>
										<option value="佤族">佤族</option>
										<option value="畲族">畲族</option>
										<option value="高山族">高山族</option>
										<option value="拉祜族">拉祜族</option>
										<option value="水族">水族</option>
										<option value="东乡族">东乡族</option>
										<option value="纳西族">纳西族</option>
										<option value="景颇族">景颇族</option>
										<option value="柯尔克孜族">柯尔克孜族</option>
										<option value="土族">土族</option>
										<option value="达斡尔族">达斡尔族</option>
										<option value="仫佬族">仫佬族</option>
										<option value="羌族">羌族</option>
										<option value="布朗族">布朗族</option>
										<option value="撒拉族">撒拉族</option>
										<option value="毛南族">毛南族</option>
										<option value="仡佬族">仡佬族</option>
										<option value="锡伯族">锡伯族</option>
										<option value="阿昌族">阿昌族</option>
										<option value="普米族">普米族</option>
										<option value="朝鲜族">朝鲜族</option>
										<option value="塔吉克族">塔吉克族</option>
										<option value="怒族">怒族</option>
										<option value="乌孜别克族">乌孜别克族</option>
										<option value="俄罗斯族">俄罗斯族</option>
										<option value="鄂温克族">鄂温克族</option>
										<option value="德昂族">德昂族</option>
										<option value="保安族">保安族</option>
										<option value="裕固族">裕固族</option>
										<option value="京族">京族</option>
										<option value="塔塔尔族">塔塔尔族</option>
										<option value="独龙族">独龙族</option>
										<option value="鄂伦春族">鄂伦春族</option>
										<option value="赫哲族">赫哲族</option>
										<option value="门巴族">门巴族</option>
										<option value="珞巴族">珞巴族</option>
										<option value="基诺族">基诺族</option>
									</select>
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">籍贯：</label>
								<div class="col-sm-8">
									<input id="natives" name="natives" placeholder="请输入长度不大于10的字符" maxlength="10" class="form-control" type="text">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">出生地：</label>
								<div class="col-sm-8">
									<input id="birthPlace" name="birthPlace" placeholder="请输入长度不大于50的字符" maxlength="50" class="form-control" type="text">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">健康状况：</label>
								<div class="col-sm-8">
									<input id="health" name="health" placeholder="请输入长度不大于10的字符" maxlength="10" class="form-control" type="text">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">联系方式：</label>
								<div class="col-sm-8">
									<input id="contact" name="contact" placeholder="请输入长度不大于20的字符" maxlength="20" class="form-control" type="text">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">现居住地：</label>
								<div class="col-sm-8">
									<input id="liveAddress" name="liveAddress" placeholder="请输入长度不大于50的字符" maxlength="50" class="form-control" type="text">
								</div>
							</div>

							<div class="form-group" style="display: none;">
								<label class="col-sm-3 control-label">1：系统用户2：录入人员：</label>
								<div class="col-sm-8">
									<label class="radio-inline">
										<input type="radio" name="isOwner" value="1" /> 系统用户
									</label>
									<label class="radio-inline">
										<input type="radio" name="isOwner" value="2" checked /> 录入人员
									</label>
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">所属部门：</label>
								<div class="col-sm-8">
									<input id="deptId" name="deptId" class="hidden">
									<input id="deptName" name="deptName" class="form-control" type="text" style="cursor: pointer;" onclick="openDept()"
										readonly="readonly" placeholder="所属部门">
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">文件：</label>
								<div class="col-sm-8">
									<input type="hidden" id="fileId" name="fileId" value="0" >
									<input id="fileName" name="fileName" class="form-control" type="text" style="cursor: pointer;"
										   readonly="readonly" placeholder="上传文件">
									<input  type="file" class="hidden" id="file1" name="file1" onchange="uploadFile1(this.files)" />
								</div>
								<script type="text/javascript">
                                    $("#fileName").click(function () {
                                        $("#file1").click();
                                    });

                                    function uploadFile1(files) {

                                        var type = files[0].type;
                                        if(type.indexOf("pdf") < 0){
                                            layer.msg('请上传pdf格式...', {
                                                icon: 2
                                            });
                                            return false;
                                        }
                                        var size = files[0].size;
//                                        if ((size / 1024 / 1024) > 2) {
//                                            layer.msg('图片大小不能超过2M...', {
//                                                icon: 2
//                                            });
//                                            return false;
//                                        }
                                        console.log("size=" + size);
                                        var formData = new FormData();
                                        formData.append("file", files[0]);
                                        $.ajax({
                                            data: formData,
                                            type: "POST",
                                            url: "/common/sysFile/upload",    // 图片上传出来的url，返回的是图片上传后的路径，http格式
                                            cache: false,
                                            contentType: false,
                                            processData: false,
                                            dataType: "json",
                                            success: function (data) {//data是返回的hash,key之类的值，key是定义的文件名
                                                $("#fileName").val(data.sysFile.originalFilename);
                                                $("#fileId").val(data.sysFileId);
                                            },
                                            error: function () {
                                                layer.msg('上传失败', {
                                                    icon: 2
                                                });
                                            }
                                        });
                                    }
								</script>
							</div>




							<div class="form-group">
								<div class="col-sm-8 col-sm-offset-3">
									<button type="submit" class="btn btn-primary">提交</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div th:include="include::footer"></div>
	<script type="text/javascript" src="/js/appjs/phry/userinfo/add.js">
	</script>
	<script>
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
                elem: '#birth',
                type: 'date',
                range: false,
                max: getNowFormatDate(),
                format: 'yyyy-M-d'
            });
        })

        function getNowFormatDate() {
            var date = new Date();
            var seperator1 = "-";
            var seperator2 = ":";
            var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
                + " " + date.getHours() + seperator2 + date.getMinutes()
                + seperator2 + date.getSeconds();
            return currentdate;
        }
	</script>
</body>
</html>
